<template>
    <div class="myform">
      <van-form validate-first @submit="onSubmit" @failed="onfail" ref="form">
        <van-field
          v-model="form.account"
          name="account"
          label="账号"
          placeholder="请输入用户名/手机号"
          clearable
          left-icon="user-o"
          :rules="[{ required: true, message: '请填写账号' }]"
        />
        <PassInput
          v-model="form.password"
          name="password"
          label="密码"
          placeholder="密码"
          :rules="[
            { required: true, message: '请填写密码' },
            {
              pattern: reg.pwd,
              message: '请输入6-16的数字字母组合的密码',
            },
          ]"
        />
  
        <div class="linkitems" style="margin: 16px">
          <router-link class="cm" :to="{ name: 'register' }"
            >没有账号,去注册</router-link
          >
          <router-link class="co" :to="{ name: 'findpass' }"
            >找回密码</router-link
          >
        </div>
        <div style="margin: 16px">
          <van-button round block type="primary" native-type="submit"
            >登录</van-button
          >
        </div>
        <div style="margin: 16px">
          <van-button
            round
            block
            type="danger"
            native-type="button"
            @click="restData"
            >重置</van-button
          >
        </div>
      </van-form>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        form: {},
      };
    },
    methods: {
      async onSubmit(value) {
        console.log(value);
        let res = await this.$ajax.findUser({
          username: value.account,
        });
        let res1 = await this.$ajax.findUser({
          phone: value.account,
        });
        if (res.length > 0 || res1.length > 0) {
          // var data = null
          //  if(res.length>0){
          //    data=res[0] //username
          //  }else{
          //     data=res1[0] //phone
          //  }
          var data = res[0] || res1[0];
          if (data.password == value.password) {
            this.changeUserInfo(data)  //全局的vuex 数据 用户信息
            this.ShowSuccess("登录成功");
              //  localStorage.setItem("lgaccount",value.account)
            localStorage.setItem("lgaccount", data.username);
            localStorage.setItem("lgphone", data.phone);
            this.$router.push({ name: "mine" });
          } else {
            this.ShowFail("账号或密码不匹配");
          }
        } else {
          this.ShowFail("登录失败");
        }
      },
      onfail() {
        this.ShowFail("校验失败");
      },
      restData() {
        this.from = {};
      },
    },
    mounted() {
      if (this.$route.query.username) {
        this.form = {
          ...this.form,
          account:this.$route.query.username,
        };
      } else {
        this.form = {
          ...this.form,
          account: localStorage.getItem("lgaccount"),
        };
      }
    },
  };
  </script>
  
<style lang="scss" scoped>
.van-button--round::v-deep {
background: #ff9db5;;
border-radius: 4px;
border: 1px solid #fb7299;
}
</style>